<template>
  <div class="wrapper">
        <swiper :options="swiperOptions">
            <swiper-slide v-for="item of swiperList" :key="item.id">
                <img class="swiper-img" :src="item.imgUrl">
            </swiper-slide>
            <div class="swiper-pagination" slot="pagination"></div>
        </swiper>
  </div>
</template>
<script>
export default {
  name: 'homeSwiper',
  data(){
      return{
          swiperList:[
              {
                  id:'001',
                  imgUrl:'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1590492129793&di=d08b4c3620e9fd7ab5cce71d2fdf9490&imgtype=0&src=http%3A%2F%2F5b0988e595225.cdn.sohucs.com%2Fq_70%2Cc_zoom%2Cw_640%2Fimages%2F20180322%2Fc2c26939f8af4679853307ce3816cd9a.jpeg'
              },
              {
                  id:'002',
                  imgUrl:'https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=306070203,3790125444&fm=26&gp=0.jpg'
              },
              {
                  id:'003',
                  imgUrl:'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1590492375201&di=7092ef86371ada3c91d59db5ffd243ed&imgtype=0&src=http%3A%2F%2Fimg2.bayuche.com%2Fupfiles%2Fthumb%2F2013-05-12%2F3%2F319284916009.jpg'
              },
              {
                  id:'004',
                  imgUrl:'https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=2408982451,1235744561&fm=26&gp=0.jpg'
              },
          ],
          swiperOptions:{
              pagination:".swiper-pagination",
              loop:true,
          }
      }
  }
}
</script>
<style lang="stylus" scoped>
.swiper-img
    width:100%
    height:215px
</style>
